<template>
  <t-modal
    :title="$ct('ChangePassword', '修改密码111')"
    :width="500"
    :visible="visible"
    :confirmLoading="loading"
    @ok="confirm"
    @cancel="cancel"
  >
    <a-spin :spinning="loading">
      <a-form :form="form">
        <a-form-item label="账号" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-input v-model="accountNumber" disabled />
        </a-form-item>
        <a-form-item
          :label="$ct('NewPassword', '新密码')"
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
        >
          <a-input-password
            autocomplete="new-password"
            placeholder="输入新密码"
            v-decorator="[
              'password',
              {
                rules: [
                  {
                    pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[\W_]).{8,16}$/,
                    required: true,
                    min: 1,
                    maxLength: 11,
                    message:
                      '必须有数字和字母组合、包含大小写字母、包含特殊字符的8到16位长度密码',
                  },
                ],
              },
            ]"
          />
        </a-form-item>
        <a-form-item
          label="确认密码"
          :labelCol="labelCol"
          :wrapperCol="wrapperCol"
        >
          <a-input-password
            autocomplete="new-password"
            placeholder="确认新密码"
            v-decorator="[
              'password2',
              {
                rules: [
                  {
                    pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[\W_]).{8,16}$/,
                    required: true,
                    min: 1,
                    maxLength: 11,
                    message:
                      '必须有数字和字母组合、包含大小写字母、包含特殊字符的8到16位长度密码',
                  },
                ],
              },
            ]"
          />
        </a-form-item>
      </a-form>
    </a-spin>
  </t-modal>
</template>

<script>
import pick from "lodash.pick";

// 表单字段
const fields = ["password"];

export default {
  props: {
    visible: {
      type: Boolean,
      required: true,
    },
    loading: {
      type: Boolean,
      default: () => false,
    },
    userUuid: {
      type: String,
      default: "",
    },
    accountNumber: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      labelCol: {
        xs: {
          span: 24,
        },
        sm: {
          span: 7,
        },
      },
      wrapperCol: {
        xs: {
          span: 24,
        },
        sm: {
          span: 13,
        },
      },
      form: this.$form.createForm(this),
    };
  },
  created() {},
  methods: {
    confirm() {
      let formData = this.form.getFieldsValue();
      if (formData.password != formData.password2) {
        this.$message.warning("新密码输入不一致！", 1.5);
      } else {
        this.form.validateFields((errors, values) => {
          if (!errors) {
            values.uuid = this.userUuid;
            delete values.password2;
            this.$post("/mdata/user/batchResetPassword", values).then((res) => {
              if (res.statusCode === 200) {
                this.$message.success(res.message, 1.5);
                this.$emit("confirm");
              } else {
                this.$message.error(res.message, 1.5);
              }
            });
          }
        });
      }
    },
    cancel() {
      this.form.resetFields();
      this.$emit("cancel");
    },
  },
};
</script>
